
                <!--Page content-->
                <!--===================================================-->
                <div id="page-content">
                    
					
					<div class="row">
					    <div class="col-sm-6">
					        <div class="panel">
					            <div class="panel-heading">
					                <h3 class="panel-title">Headings</h3>
					            </div>
					            <div class="panel-body">
					                <div class="pad-btm">
					
					                <!--Headings-->
					                <!--===================================================-->
					                <h6 class="text-main">Heading 6 <small>Secondary text</small></h6>
					                <h5 class="text-main">Heading 5 <small>Secondary text</small></h5>
					                <h4 class="text-main">Heading 4 <small>Secondary text</small></h4>
					                <h3 class="text-main">Heading 3 <small>Secondary text</small></h3>
					                <h2 class="text-main">Heading 2 <small>Secondary text</small></h2>
					                <h1 class="text-main">Heading 1 <small>Secondary text</small></h1>
					                <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					    </div>
					    <div class="col-sm-6">
					        <div class="panel">
					            <div class="panel-heading">
					                <h3 class="panel-title">Paragraph</h3>
					            </div>
					            <div class="panel-body">
					
					                <!--Paragraph-->
					                <!--===================================================-->
					                <p class="text-main text-semibold">Paragraph Text</p>
					                <p>Of on affixed civilly moments promise explain
					                fertile in. Assurance advantage belonging happiness
					                departure so of. Now improving and one sincerity
					                intention allowance commanded not. Oh an am frankness
					                be necessary earnestly advantage estimable extensive.
					                Five he wife gone ye. Mrs suffering sportsmen earnestly
					                any. In am do giving to afford parish settle easily
					                garret.</p>
					                <!--===================================================-->
					
					            </div>
					        </div>
					        <div class="panel">
					            <div class="panel-heading">
					                <h3 class="panel-title">Marked text</h3>
					            </div>
					            <div class="panel-body">
					
					                <!--Marked Text-->
					                <!--===================================================-->
					                You can use the mark tag to <mark>highlight text</mark>.
					                <!--===================================================-->
					
					            </div>
					        </div>
					    </div>
					</div>
					<div class="row">
					    <div class="eq-height">
					        <div class="col-md-6 col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Font weight</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Font Weight-->
					                    <!--===================================================-->
					                    <div class="row">
					                        <div class="col-sm-6">
					                            <p class="text-thin">Thin font</p>
					                            <p>Normal font</p>
					                        </div>
					                        <div class="col-sm-6">
					                            <p class="text-semibold">Semi-bold font</p>
					                            <p class="text-bold">Bold font</p>
					                        </div>
					                    </div>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					        <div class="col-md-6 col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Unselectable Text</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Unselectable Text-->
					                    <!--===================================================-->
					                    <p>This text is selectable.</p>
					                    <p class="unselectable">This text is unselectable.</p>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					        <div class="col-md-12 col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Deleted text</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Deleted Text-->
					                    <!--===================================================-->
					                    <del>This line of text is meant to be treated as deleted text.</del><br>
					                    <s>This line of text is meant to be treated as no longer accurate.</s>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					    </div>
					</div>
					<div class="row">
					    <div class="eq-height">
					        <div class="col-md-12 col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Underlined text</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Underline Text-->
					                    <!--===================================================-->
					                    <u>This line of text will render as underlined</u><br><br>
					                    <ins>This line of text will render as underlined</ins>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					        <div class="col-md-6 col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Small text</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Small Text-->
					                    <!--===================================================-->
					                    <small>This line of text is meant to be treated as fine print.</small>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					        <div class="col-md-6 col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Italics text</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Italics Text-->
					                    <!--===================================================-->
					                    <em>rendered as italicized text</em>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					    </div>
					</div>
					<div class="row">
					    <div class="eq-height">
					        <div class="col-md-12 col-lg-6 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Text Colors</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Text Colors-->
					                    <!--===================================================-->
					                    <p class="text-muted">Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.</p>
					                    <p class="text-primary">Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
					                    <p class="text-success">Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
					                    <p class="text-info">Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
					                    <p class="text-warning">Etiam porta sem malesuada magna mollis euismod.</p>
					                    <p class="text-danger">Donec ullamcorper nulla non metus auctor fringilla.</p>
					                    <p class="text-mint">Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.</p>
					                    <p class="text-purple">Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
					                    <p class="text-pink">Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
					                    <p class="text-dark">Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					        <div class="col-md-12 col-lg-6 eq-box-lg">
					            <div class="row">
					                <div class="eq-height">
					                    <div class="col-sm-6 eq-box-sm">
					                        <div class="panel">
					                            <div class="panel-heading">
					                                <h3 class="panel-title">Transformation classes</h3>
					                            </div>
					                            <div class="panel-body">
					
					                                <!--Transformation Classes-->
					                                <!--===================================================-->
					                                <p class="text-lowercase">Lowercased text.</p>
					                                <p class="text-uppercase">Uppercased text.</p>
					                                <p class="text-capitalize">Capitalized text.</p>
					                                <!--===================================================-->
					
					                            </div>
					                        </div>
					                    </div>
					                    <div class="col-sm-6 eq-box-sm">
					                        <div class="panel">
					                            <div class="panel-heading">
					                                <h3 class="panel-title">Code</h3>
					                            </div>
					                            <div class="panel-body">
					
					                                <!--Code-->
					                                <!--===================================================-->
					                                <p>Wrap inline snippets of code with <code>&lt;code&gt;</code>.</p>
					                                <p>For example, <code>&lt;section&gt;</code> should be wrapped as inline.</p>
					                                <!--===================================================-->
					
					                            </div>
					                        </div>
					                    </div>
					                </div>
					            </div>
					            <div>
					                <div class="panel">
					                    <div class="panel-heading">
					                        <h3 class="panel-title">Addresses</h3>
					                    </div>
					                    <div class="panel-body">
					
					                        <!--Address-->
					                        <!--===================================================-->
					                        <address>
					                            <strong class="text-main">Twitter, Inc.</strong><br>
					                            795 Folsom Ave, Suite 600<br>
					                            San Francisco, CA 94107<br>
					                            <abbr title="Phone">P:</abbr> (123) 456-7890
					                        </address>
					                        <address>
					                            <strong class="text-main">Full Name</strong><br>
					                            <a href="mailto:#">first.last@example.com</a>
					                        </address>
					                        <!--===================================================-->
					
					                    </div>
					                </div>
					            </div>
					        </div>
					    </div>
					</div>
					<div class="panel">
					    <div class="panel-heading">
					        <h3 class="panel-title">Text alignment</h3>
					    </div>
					    <div class="panel-body">
					
					        <!--Text Alignment-->
					        <!--===================================================-->
					        <p class="text-left">Left aligned text.</p>
					        <p class="text-center">Center aligned text.</p>
					        <p class="text-right">Right aligned text.</p>
					        <p class="text-justify">Justified text.</p>
					        <p class="text-nowrap">No wrap text.</p>
					        <!--===================================================-->
					
					    </div>
					</div>
					
					<br>
					<h4 class="text-main pad-btm bord-btm">List</h4>
					<div class="row">
					    <div class="eq-height">
					    <div class="col-md-6 col-lg-4 eq-box-lg">
					        <div class="panel">
					            <div class="panel-heading">
					                <h3 class="panel-title">Unordered List</h3>
					            </div>
					            <div class="panel-body">
					
					                <!--Unordered List-->
					                <!--===================================================-->
					                <ul>
					                    <li>Lorem ipsum dolor sit amet</li>
					                    <li>Consectetur adipiscing elit</li>
					                    <li>Integer molestie lorem at massa</li>
					                    <li>Facilisis in pretium nisl aliquet</li>
					                    <li>Nulla volutpat aliquam velit</li>
					                </ul>
					                <!--===================================================-->
					
					            </div>
					        </div>
					    </div>
					    <div class="col-md-6 col-lg-4 eq-box-lg">
					        <div class="panel">
					            <div class="panel-heading">
					                <h3 class="panel-title">Ordered List</h3>
					            </div>
					            <div class="panel-body">
					
					                <!--Ordered List-->
					                <!--===================================================-->
					                <ol>
					                      <li>Lorem ipsum dolor sit amet</li>
					                      <li>Consectetur adipiscing elit</li>
					                      <li>Integer molestie lorem at massa</li>
					                      <li>Facilisis in pretium nisl aliquet</li>
					                      <li>Nulla volutpat aliquam velit</li>
					                </ol>
					                <!--===================================================-->
					
					            </div>
					        </div>
					    </div>
					    <div class="col-md-12 col-lg-4 eq-box-lg">
					        <div class="panel">
					            <div class="panel-heading">
					                <h3 class="panel-title">Unstyled List</h3>
					            </div>
					            <div class="panel-body">
					
					                <!--Unstyled List-->
					                <!--===================================================-->
					                <ul class="list-unstyled">
					                    <li>Lorem ipsum dolor sit amet</li>
					                    <li>Consectetur adipiscing elit</li>
					                    <li>Integer molestie lorem at massa</li>
					                    <li>Facilisis in pretium nisl aliquet</li>
					                    <li>Nulla volutpat aliquam velit</li>
					                </ul>
					                <!--===================================================-->
					
					            </div>
					        </div>
					    </div>
					    </div>
					</div>
					<div class="row">
					    <div class="eq-height">
					        <div class="col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Inline List</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Inline List-->
					                    <!--===================================================-->
					                    <ul class="list-inline">
					                        <li>Lorem ipsum</li>
					                        <li>Phasellus iaculis</li>
					                        <li>Nulla volutpat</li>
					                    </ul>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					        <div class="col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Description</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Description-->
					                    <!--===================================================-->
					                    <dl>
					                        <dt>Description lists</dt>
					                        <dd>A description list is perfect for defining terms.</dd>
					                        <dt>Euismod</dt>
					                        <dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
					                        <dd>Donec id elit non mi porta gravida at eget metus.</dd>
					                        <dt>Malesuada porta</dt>
					                        <dd>Etiam porta sem malesuada magna mollis euismod.</dd>
					                    </dl>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					        <div class="col-lg-4 eq-box-lg">
					            <div class="panel">
					                <div class="panel-heading">
					                    <h3 class="panel-title">Horizontal description</h3>
					                </div>
					                <div class="panel-body">
					
					                    <!--Horizontal description-->
					                    <!--===================================================-->
					                    <dl class="dl-horizontal">
					                        <dt>Description lists</dt>
					                        <dd>A description list is perfect for defining terms.</dd>
					                        <dt>Euismod</dt>
					                        <dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
					                        <dd>Donec id elit non mi porta gravida at eget metus.</dd>
					                        <dt>Malesuada porta</dt>
					                        <dd>Etiam porta sem malesuada magna mollis euismod.</dd>
					                    </dl>
					                    <!--===================================================-->
					
					                </div>
					            </div>
					        </div>
					    </div>
					</div>
					
					
                </div>
                <!--===================================================-->
                <!--End page content-->
